<template>
	<view style="padding-bottom: 100rpx;">
		<image src="/static/index/bg.png" class="bg" mode="widthFix"></image>
		<image src="/static/index/tit.png" class="tit" mode="widthFix"></image>
		<view class="navs flex align between">
			<view class="item">
				<image src="../../static/index/a1.png"></image>
				<view class="name">播放总量</view>
				<view class="num">{{info.view_count}}</view>
			</view>
			<view class="item">
				<image src="../../static/index/a2.png"></image>
				<view class="name">矩阵视频</view>
				<view class="num">{{info.video_count}}</view>
			</view>
			<view class="item">
				<image src="../../static/index/a3.png"></image>
				<view class="name">视频评论</view>
				<view class="num">{{info.comment_count}}</view>
			</view>
			<view class="item">
				<image src="../../static/index/a4.png"></image>
				<view class="name">账号管理数</view>
				<view class="num">{{info.user_count}}</view>
			</view>
		</view>
		<view class="navs2 flex align between">
			<navigator url="/pages/chart/index" hover-class="none" class="item">
				<image src="../../static/index/b1.png"></image>
				<view>数据看板</view>
			</navigator>
			<navigator url="/pages/material/navs?type=1&name=素材库" hover-class="none" class="item">
				<image src="../../static/index/b2.png"></image>
				<view>素材库</view>
			</navigator>
			<navigator url="/pages/intellect/intellect" hover-class="none" class="item">
				<image src="../../static/index/b3.png"></image>
				<view>智能文案</view>
			</navigator>
		</view>
		<!-- 收费标准 -->
		<view class="notice flex">
			<image src="/static/index/img.png"></image>
			<view style="width: 80%;margin-left: 70rpx;"> <uni-notice-bar scrollable single text="收费标准....."
					background-color="#2D2D2D" color="#FFCDB8"></uni-notice-bar></view>
		</view>
		<view class="main">
			<view class="main-title">运营&授权</view>
			<view class="card flex align wrap">
				<navigator url="/pages/material/navs?type=2&name=视频创作" hover-class="none" class="card-item">
					<image src="/static/index/c1.png"></image>
					<view>视频创作</view>
				</navigator>
				<navigator url="/pages/material/navs?type=3&name=蓝V授权" hover-class="none" class="card-item">
					<image src="/static/index/c2.png"></image>
					<view>蓝V授权</view>
				</navigator>
				<navigator url="/pages/material/navs?type=4&name=视员工号授权" hover-class="none" class="card-item">
					<image src="/static/index/c3.png"></image>
					<view>员工号授权</view>
				</navigator>
				<navigator url="/pages/material/navs?type=5&name=视频发布" hover-class="none" class="card-item">
					<image src="/static/index/c4.png"></image>
					<view>视频发布</view>
				</navigator>
				<navigator url="/pages/material/navs?type=9&name=爆店码" hover-class="none" class="card-item">
					<image src="/static/index/c6.png"></image>
					<view>爆店码</view>
				</navigator>
				<navigator url="/pages/reply/index" hover-class="none" class="card-item">
					<image src="/static/index/c5.png"></image>
					<view>智能回复设置</view>
				</navigator>
			</view>
			<view class="main-title">引流&排名</view>
			<view class="card flex align wrap">
				<navigator url="/pages/material/navs?type=6&name=公域转私域" hover-class="none" class="card-item">
					<image src="/static/index/d1.png"></image>
					<view>公域转私域</view>
				</navigator>
				<navigator url="/pages/material/navs?type=7&name=排名" hover-class="none" class="card-item">
					<image src="/static/index/d2.png"></image>
					<view>排名</view>
				</navigator>
				<navigator url="/pages/material/navs?type=8&name=话题设置" hover-class="none" class="card-item">
					<image src="/static/index/d3.png"></image>
					<view>话题设置</view>
				</navigator>
			</view>
		</view>
	</view>
</template>

<script>
	import {
		dashboardIndex,
		storePayIndex
	} from '@/api/apiData.js';
	export default {
		data() {
			return {
				title: 'Hello',
				info:''
			}
		},
		onShow() {
			this.getInfo()
		},
		onShareAppMessage(res) {
		
		},
		methods: {
			async getInfo() {
				let result2 = await storePayIndex();
				const result = await dashboardIndex()
				if (result.code == 1) {
					this.info = result.data
				} else {
					uni.showToast({
						title: result.msg,
						icon: 'none'
					})
				}
			}

		}
	}
</script>

<style lang="scss" scoped>
	.bg {
		position: absolute;
		width: 100%;
		height: auto;
		top: 0;
		left: 0;
		z-index: -1;
	}

	.tit {
		width: 526rpx;
		height: 300rpx;
		display: block;
		margin: 175rpx auto 82rpx;
	}

	.navs {
		flex-wrap: wrap;
		margin: 0 60rpx 52rpx;

		.item {
			width: 268rpx;
			height: 146rpx;
			position: relative;
			margin-bottom: 30rpx;

			image {
				position: absolute;
				width: 100%;
				height: 100%;
			}

			view {
				position: relative;
				padding: 20rpx 34rpx 0;
			}

			.name {
				font-size: 18rpx;
			}

			.num {
				font-size: 48rpx;
				font-weight: bold;
			}
		}
	}

	.navs2 {
		background: linear-gradient(to bottom, #FFDCCD, #FFC8B1);
		padding: 10rpx 38rpx 40rpx;
		height: 132rpx;
		margin: 0 60rpx;
		border-radius: 12rpx;

		.item {
			font-size: 24rpx;
			font-weight: bold;
			text-align: center;

			image {
				width: 124rpx;
				height: 124rpx;
			}
		}
	}

	.notice {
		background: #2D2D2D;
		padding: 0 30rpx;
		margin-top: 66rpx;
		position: relative;
		height: 60rpx;

		image {
			width: 74rpx;
			height: 84rpx;
			position: absolute;
			bottom: 0;
		}
	}

	.main {
		margin: 30rpx;

		.main-title {
			font-size: 32rpx;
			color: #2D2D2D;
			font-weight: bold;
			margin-bottom: 20rpx;
		}

		.card {
			background: #2D2D2D;
			border-radius: 12rpx;
			padding: 20rpx 47rpx;
			margin-bottom: 30rpx;
		}

		.card-item {
			width: 25%;
			text-align: center;
			color: #FFCDB8;
			font-size: 24rpx;
			margin-bottom: 20rpx;

			image {
				width: 68rpx;
				height: 68rpx;
			}
		}
	}
</style>